import 'package:fate_blind_box/chat_view/ahu_text.dart';
import 'package:fate_blind_box/config/app_style.dart';
import 'package:fate_blind_box/widget/meet_appbar.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import 'logic.dart';

class SetRemarksPage extends GetView<SetRemarksLogic> {
  const SetRemarksPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: MeetAppBar(
          title: '设置备注',
          rightBtn: rightBtn(),
        ),
        backgroundColor: '#F6F6F6'.stringToColor,
        body: Padding(
          padding: EdgeInsets.symmetric(horizontal: 15.w),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              SizedBox(height: 19.w),
              AhuText(
                text: '备注',
                fontSize: 17,
                color: '#777777'.stringToColor,
              ),
              SizedBox(height: 14.w),
              Container(
                padding: EdgeInsets.symmetric(horizontal: 14.w),
                height: 50.w,
                width: double.infinity,
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(5.w),
                    color: Colors.white),
                child: Row(
                  children: [
                    Expanded(
                      child: TextField(
                          controller: controller.state.textEditingController,
                          textAlign: TextAlign.left,
                          style: TextStyle(
                              color: const Color(0xff333333), fontSize: 16.sp),
                          autofocus: false,
                          //光标颜色
                          cursorColor: "FE5E31".stringToColor,
                          minLines: 1,
                          maxLines: 1,
                          inputFormatters: <TextInputFormatter>[
                            LengthLimitingTextInputFormatter(24),
                            // FilteringTextInputFormatter.allow(
                            //     Config.defaultReg),
                            //限制长度
                          ],
                          textAlignVertical: TextAlignVertical.center,
                          decoration: InputDecoration(
                            labelStyle: TextStyle(
                                color: const Color(0xff999999),
                                fontSize: 14.sp),
                            hintText: '请输入备注',
                            hintStyle: TextStyle(
                                color: const Color(0xffAAAAAA),
                                fontSize: 14.sp),
                            contentPadding:
                                EdgeInsets.symmetric(vertical: 14.w),
                            focusedBorder: OutlineInputBorder(
                              borderSide:
                                  const BorderSide(color: Colors.transparent),
                              borderRadius:
                                  BorderRadius.circular(5.w), // 设置圆角大小
                            ),
                            enabledBorder: OutlineInputBorder(
                              borderSide:
                                  const BorderSide(color: Colors.transparent),
                              borderRadius:
                                  BorderRadius.circular(5.w), // 设置圆角大小
                            ),
                            filled: true,
                            fillColor: '#FFFFFF'.stringToColor,
                            isCollapsed: false,
                            isDense: true,
                          )),
                    ),
                    GetX<SetRemarksLogic>(
                      init: SetRemarksLogic(),
                      initState: (_) {},
                      builder: (logic) {
                        return AhuText(
                          text: '${logic.state.count}/24',
                          color: '#A7A7A7'.stringToColor,
                          fontSize: 16,
                          fontWeight: FontWeight.w400,
                        );
                      },
                    ),
                  ],
                ),
              ),
            ],
          ),
        ));
  }

  Widget rightBtn() {
    return InkWell(
      onTap: () => controller.setRemake(),
      child: GetX<SetRemarksLogic>(
        init: SetRemarksLogic(),
        initState: (_) {},
        builder: (logic) {
          return Container(
            margin: EdgeInsets.only(right: 12.w),
            decoration: BoxDecoration(
              color: logic.state.count > 0
                  ? '#614AC0'.stringToColor
                  : '#DDDDDD'.stringToColor,
              borderRadius: BorderRadius.circular(5.w),
            ),
            width: 54.w,
            height: 31.w,
            child: Center(
                child: AhuText(
              text: '完成',
              fontWeight: FontWeight.w400,
              fontSize: 16,
              color: logic.state.count > 0
                  ? '#FFFFFF'.stringToColor
                  : '#AAA8A8'.stringToColor,
            )),
          );
        },
      ),
    );
  }
}
